<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <style>
            * {
              box-sizing: border-box;
            }
        
            html,
            body {
              display: flex;
              flex-direction: column;
              padding: 0;
              margin: 0;
              height: 100%;
               
              touch-action: manipulation;
            }
        
            iframe {
              flex: 1;
            }
        </style>
    </head>
    <body>
        <div class="app" style="height: 100vh;width: 100%;"></div>
        <script src="https://cdn.bootcss.com/babel-core/5.8.35/browser.min.js"></script>
        <script src="https://cdn.bootcss.com/babel-core/5.8.35/browser-polyfill.min.js"></script>
        <script src="src/base64.js"></script>
        <script src="src/sdk-v0.2.1.js"></script>

        <script type="text/babel">

        window.onload = async function() {
            var url = await COSDocPreviewSDK.getPreviewUrl( {
                objectUrl: 'https://test-125XXXXXXX.cos.ap-chongqing.myqcloud.com/test.pdf',
                copyable: 0,
                htmlwaterword: Base64.encodeUrl('test'),
                htmlfillstyle: Base64.encodeUrl('#006eff'),
                htmlfillstyle: Base64.encodeUrl('rgba(255,0,0,0.5)'),
                htmlfront: Base64.encodeUrl('bold 10px Serif'),
                htmlrotate: 30,
                htmlhorizontal: 100,
                htmlvertical: 40,
                credentials: {      // 如果预览文件是私有的，则需要携带访问凭证。
                    authorization: 'q-sign-algorithmxxxxxxxxxxxxxxx',
                }
            })

            const demo = COSDocPreviewSDK.config({
                mount: document.querySelector('.app'),
                url,
                mode: 'normal',
                commonOptions: {
                    isShowHeader: false,
                    isShowTopArea: false
                }
            });

            demo.on('fileOpen', function(data) {
                console.log('打开成功');
                test();
            });

            const test = async () => {
                await demo.ready();
                console.log('demo ready');

                testPPT()
            }

            const testPPT = async () => {
                const app = demo.PPTApplication();
                // 播放
                await demo.PPTApplication().ActivePresentation.SlideShowSettings.Run()
                // 跳转到第3页
                await demo.PPTApplication().ActivePresentation.SlideShowWindow.View.GotoSlide(3)
            };
            
        }

        </script>
    </body>
</html>